Single Product
Introducing the Turbo Theme Single Product Page Builder
Elementor plugin is required for building and customizations.
Our custom-built Single Product Page Builder for the Turbo theme, powered by Elementor, brings a new level of flexibility and ease to designing the perfect online storefront. Whether you’re looking to showcase products in unique layouts or create a seamless shopping experience, this builder provides a powerful set of tools and customization options for building attractive, fully responsive shop pages without any coding required.
Key Features
- Drag-and-Drop Functionality: Use Elementor’s intuitive drag-and-drop interface to build shop pages quickly and easily.
- Customizable Product Layouts: Choose from multiple layouts to showcase products in grid, list, or masonry styles, allowing complete control over the presentation.
- Advanced Filtering Options: Integrate advanced filters for price, categories, tags, and more to make browsing easier for customers.
- Dynamic Sorting Options: Allow shoppers to sort products by popularity, rating, newest, or price for a smooth browsing experience.
- Custom Widgets for Products: Easily add custom widgets like featured products, best sellers, on-sale items, and product categories.
- Responsive Design Controls: Ensure a mobile-friendly experience with tools to optimize layouts across devices.
- Customizable Call-to-Action Elements: Add buttons and banners to highlight discounts, offers, and important announcements.
- WooCommerce Compatibility: Fully compatible with WooCommerce, ensuring seamless integration with all shop functions.
- SEO-Friendly Structure: Optimized for SEO with clean code and layout structures that support search engine visibility.
- Live Preview Editing: See changes in real-time with Elementor’s live preview feature, so you know exactly how your page will look before publishing.
This builder is designed to give users the ultimate control over their single product page, making it easy to create a professional, engaging shopping experience that aligns perfectly with the Turbo theme.
Steps to follow
Step 1: Access Turbo Builder
- Go to Dashboard: From your WordPress dashboard, navigate to the main menu on the left side.
- Navigate to Turbo Builder:
- Click on Turbo in the sidebar menu.
- Select Turbo Builder from the dropdown menu. This is where you’ll configure your shop page layout.
Step 2: Create a single product item
The Single Product is a repeating template that controls how each product will appear. Setting up the Product page allows you to decide how product information like title, image, review, and price will be displayed.
i. Add a New Single product:
- In the Turbo Builder, look for the option to add a Single Product Item and click on it.
- This will create a template for the individual product display.
pictorial description:
- Specify a name for the Single Product Page template.
- From the dropdown menu, select Single Product as the template type..
- Select the button.
Checked: When checked, the Single Product Page will be activated, and a popup will appear.
UnChecked: When unchecked, the Single Product Page will not be activated, but a popup will still appear.
-
Save or update the builder settings.
-
Click Edit with elementor.
ii. Configure Single Product Item Elements:
- Add elements like single Product Title, single product Image, single product pricing, single product pricing flip box, single product add to cart, and single product tab to the single product item.
- Customize each element by dragging and dropping it into the loop layout to match your theme’s style.
- Publish the Single Product Page once the layout meets your satisfaction.
Step 3: Edit the attribute of the single product
Step 4: Publish and Preview Changes
- Click Save or Publish to apply changes to your single product page.
- Navigate to the front end of your site to preview the Single Product Page. All configured elements should be displayed as expected.
By following these steps, you will create a fully customizable Single Product Page in the Turbo theme using Elementor and the Turbo Builder.